import { Component, OnInit } from '@angular/core';
import {Path} from "../../../../portal/admin/admin-breadcrumb/breadcrumb";
import {PageSubject} from "../../../../util/page-subject";
import {WaterSurfaceService} from "./water-surface.service";
import {OneDialogService} from "../../../../widgets/one-dialog/one-dialog.service";
import {ResponseUtil} from "../../../../util/response-util";
import {MsgResult} from "../../../../models/msg-result";
import {MsgConstants} from "../../../../constants/constants";
import {TableUtil} from "../../../../util/table-util";

declare var $;
declare var moment;

@Component({
  selector: 'app-water-surface',
  templateUrl: './water-surface.component.html',
  styleUrls: ['./water-surface.component.css']
})
export class WaterSurfaceComponent implements OnInit {
  config;tableDataObj;table;
  constructor(
    private pageSubject : PageSubject,
    private WaterSurfaceService : WaterSurfaceService,
    private responseUtil :ResponseUtil,
    private tableUtil:TableUtil,
    private dialogService: OneDialogService,
  ) { }

  ngOnInit() {
    this.pushPage();
    this.tableDataObj = {"dataType":"hourData","startTime":moment().subtract(2,"d").subtract(1,"h").format("YYYY-MM-DD HH")+":00:00","endTime":moment().subtract(1,"d").subtract(1,"h").format("YYYY-MM-DD HH")+":00:00"};
    this.tableContentData(this.tableDataObj);
    this.initTime();
    this.initEvent();
  }
  //面包屑导航
  pushPage() {
    let path = new Path("数据查询", "");
    this.pageSubject.pushPage("水环境质量", "", path);
  }


  //表格数据
  tableContentData(obj){
    this.WaterSurfaceService.waterSurfaceData(obj).subscribe(
      result => this.responseUtil.success(result,this.tableContentDataResult),
      message => this.responseUtil.error(message)
    );
  }
  private tableContentDataResult = (result: MsgResult) =>{
    if (result && result.code == MsgConstants.MSG_CODE_OK) {
      this.tableContentDataTree(result.data);
    }
    if (result && result.code != MsgConstants.MSG_CODE_OK) {
      this.dialogService.info(result.message);
    }
  }
  private tableContentDataTree(data){
    $(".one-data-loadState").hide();
      console.log("表格数据加载成功");
      if(data == ""||data == null){
        data =[];
      }
        this.waterSurfaceTableContent(data);
  }

  //表格内容
  waterSurfaceTableContent(data){
    $(".one-table-area").html('<table class="table table-striped" id="polluteDataTable"></table>');
    this.table=this.tableUtil.load("polluteDataTable",{
      columns: [
        {
          field: 'index',
          title: '排名',
          width:35
        }, {
          field: 'cityName',
          title: '城市',
          align:"left",
          halign:"center",
          width:50
        }, {
          field: 'companyName',
          title: '企业名称',
          align:"left",
          halign:"center",
          width:90
        }, {
          field: 'monitorTime',
          title: '监测时间',
          width:120,
          align:"left",
          halign:"center"
        }, {
          field: 'avgStrength001',
          title: 'COD(mg/m3)',
          width:90,
          align:"right",
          halign:"center"
        }, {
          field: 'avgStrength002',
          title: '氨氮(mg/m3)',
          width:90,
          align:"right",
          halign:"center"
        }, {
          field: 'avgStrength003',
          title: '总磷(mg/m3)',
          width:90,
          align:"right",
          halign:"center"
        }, {
          field: 'avgStrength004',
          title: '总氮(mg/m3)',
          width:90,
          align:"right",
          halign:"center"
        }, {
          field: 'avgStrength005',
          title: 'TOD',
          width:50,
          align:"right",
          halign:"center"
        }, {
          field: 'avgStrength013',
          title: '溶解氧',
          width:50,
          align:"left",
          halign:"center"
        }, {
          field: 'avgStrength014',
          title: '浊度',
          width:50,
          align:"left",
          halign:"center"
        }, {
          field: 'avgStrength015',
          title: '电导率',
          width:50,
          align:"left",
          halign:"center"
        }
      ],
      data:data,
      pagination :true,
      paginationLoop: false,
      striped :true,
      paginationPreText : "上一页",
      paginationNextText :"下一页",
      undefinedText : " ",
      height:$(window.innerHeight)[0]-224,
      pageSize:15,
      pageList :[10,15,20]
    });
  }

  //初始化时间插件
  initTime(){
//配置信息
this.config = {
timePicker:true,
timePickerIncrement:5,
timePicker24Hour:true,
maxDate:new Date(),
locale:{
  format:"YYYY-MM-DD HH:00",
  separator: " 至 ",
  applyLabel : '确定',
  cancelLabel : '取消',
  fromLabel: '从',
  toLabel: '到',
  weekLabel: 'W',
  customRangeLabel: 'Custom Range',
  daysOfWeek:["日","一","二","三","四","五","六"],
  monthNames: ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
  firstDay:1
},
startDate: moment().subtract(1,"d").subtract(1,"h").format("YYYY-MM-DD HH")+":00:00",
endDate: moment().subtract(1,"h").format("YYYY-MM-DD HH")+":00:00"
};
//初始化日期插件
$("#waterQualityDate").daterangepicker(this.config);
}

  //初始化事件
  initEvent(){
    $(".search").click(function () {
      $(".one-data-loadState").show();
      let dataType = $(".dataType").find(".active").attr("id");
      let startTime =  $.trim($("#waterQualityDate").val().split("至")[0]);
      let endTime =  $.trim($("#waterQualityDate").val().split("至")[1]);
      startTime += startTime.split(" ").length==1?" 00:00:00":":00";
      endTime += endTime.split(" ").length==1?" 00:00:00":":00";
      let waterObj = {"dataType":dataType,"startTime":startTime,"endTime":endTime};
      this.tableContentData(waterObj);
    }.bind(this));
    $(".days").click(function(e){
      this.config.locale.format="YYYY-MM-DD";
      this.config.timePicker=false;
      this.config.startDate = moment().subtract(6,"d").format("YYYY-MM-DD");
      this.config.endDate = moment().subtract(1,"d").format("YYYY-MM-DD");
      $("#waterQualityDate").daterangepicker(this.config);
      $(e.target).addClass("active").siblings(".active").removeClass("active");
    }.bind(this));
    $(".hours").click(function(e){
      this.config.locale.format="YYYY-MM-DD HH:00";
      this.config.timePicker=true;
      this.config.startDate = moment().subtract(2,"d").subtract(1,"h").format("YYYY-MM-DD HH")+":00:00";
      this.config.endDate = moment().subtract(1,"d").subtract(1,"h").format("YYYY-MM-DD HH")+":00:00";
      $("#waterQualityDate").daterangepicker(this.config);
      $(e.target).addClass("active").siblings(".active").removeClass("active");
    }.bind(this));
    $(".minutes").click(function(e){
      this.config.locale.format="YYYY-MM-DD HH:mm";
      this.config.timePicker=true;
      this.config.startDate = moment().subtract(31,"m").format("YYYY-MM-DD HH:mm")+":00";
      this.config.endDate = moment().subtract(1,"m").format("YYYY-MM-DD HH:mm")+":00";
      $("#waterQualityDate").daterangepicker(this.config);
      $(e.target).addClass("active").siblings(".active").removeClass("active");
    }.bind(this));
    //添加导出按钮
    $(function(){
      $(".one-btn-data-type").append("<div class='pull-right'><button class='btn btn-success export'>导出为Excel</button></div>");
      $(".export").click(function(){
        var requestUrl = "";
        var baseUrl = location.protocol + "//" + location.host + "/";
        var dataType=$(".dataType").find(".active").attr("id");
        var startTime =  $.trim($("#waterQualityDate").val().split("至")[0]);
        var endTime =  $.trim($("#waterQualityDate").val().split("至")[1]);
        startTime += startTime.split(" ").length==1?" 00:00:00":":00";
        endTime += endTime.split(" ").length==1?" 00:00:00":":00";
        requestUrl = "api/exportExcel/waterSurfaceDataExcelExport?format=json&"; //不正确
        var objString = "endTime="+endTime+"&startTime="+startTime+"&dataType="+dataType;
        window.location.href = baseUrl+requestUrl+objString;
      })
    });
  }
}
